<template>
  <div class="app-container">
    <el-row :gutter="5">
      <el-col :span="12" style="margin-bottom: 10px">
        <el-card>
          <series :product-id="productId" style="height:340px" class="uni-scroll" />
        </el-card>
      </el-col>
      <el-col :span="12" style="margin-bottom: 10px">
        <el-card>
          <hardware :product-id="productId" style="height:340px" class="uni-scroll" />
        </el-card>
      </el-col>
      <el-col :span="12" style="margin-bottom: 10px">
        <el-card>
          <software :product-id="productId" style="height:340px" class="uni-scroll" />
        </el-card>
      </el-col>
      <el-col :span="12" style="margin-bottom: 10px">
        <el-card>
          <firmware :product-id="productId" style="height:340px" class="uni-scroll" />
        </el-card>
      </el-col>
    </el-row>
    <el-card style="margin-bottom: 10px">
      <plan :product-id="productId" />
    </el-card>
  </div>
</template>

<script>
import Firmware from './components/Firmware'
import Hardware from './components/Hardware'
import Series from './components/Series'
import Software from './components/Software'
import Plan from './components/Plan'
export default {
  name: 'OtaManage',
  components: {
    Firmware,
    Hardware,
    Series,
    Software,
    Plan
  },
  data() {
    return {
      productId: null,
      productName: null
    }
  },
  created() {
    const param = this.$route.query
    this.productId = parseInt(param.productId)
    this.productName = param.productName
    this.setTagsViewTitle()
  }, methods: {
    setTagsViewTitle() {
      this.tempRoute = Object.assign({}, this.$route)
      const route = Object.assign({}, this.tempRoute, {
        title: `${this.productName}`
      })
      this.$store.dispatch('tagsView/updateVisitedView', route)
    }
  }
}
</script>


